<template>
  <div class="base_view index_view">
    <AbNav/>
    <!-- <AbNav is_show /> -->
    <AbBanner/>
    <!-- <div class="ab_banner">
      <img class="banner_image" alt="banner" src="http://image.fengfengzhidao.com/gvb_1009/20231123092743__1123-h.png">
    </div> -->
    <div class="ab_base_container">3</div>
    <div class="ab_footer"></div>
    <RouterView />
  </div>
</template>

<script setup lang="ts">
import { defineComponent } from "vue";
import { RouterLink, RouterView } from "vue-router";
import AbNav from "@/components/web/AbNav.vue";
import AbBanner from "@/components/web/AbBanner.vue";

// export default defineComponent({
//   setup() {
//     return {};
//   },
// });
</script>

<style lang="scss">
// .ab_nav {
//   width: 100%;
//   height: 60px;
//   background-color: white;
//   box-shadow: 1px 1px 5px #0003;
//   display: flex;
//   justify-content: center;
//   font-size: 16px;

//   .logo {
//     width: 10%;
//     transform: scale(0.9);
//     div:first-child {
//       font-size: 26px;
//     }
//     // 不能有空行
//     div:last-child {
//       font-size: 12px;
//     }
//   }

//   .left {
//     width: 50%;
//     display: flex;
//     span {
//       margin-right: 30px;
//     }
//     a {
//       color: #2b3539;

//       &:hover {
//         color: blue;
//       }
//     }
//   }

//   .right {
//     width: 40%;
//     display: flex;
//     justify-content: right;
//     a {
//       color: #2b3539;
//     }

//     .loginButton {
//       margin-right: 20px;
//     }
//   }

//   .search i {
//     cursor: pointer;
//   }
// }


// .ab_footer {
//   width: 100px;
//   background-color: #000;
// }
.base_view {
  background-color: #f0eeee;
  margin-top: 0;

  .ab_base_container {
    //   background-color: #eee;
    // align-items: center;
    display: flex;
    justify-content: center;
    min-height: 1000px;

    .ab_inner_container {
      background-color: white;
      min-height: 1000px;
      width: 1200px;
      margin-top: 20px;

    }
  }
}

body {
  --bg: #f0eeee;
  --active: rgb(var(--arcoblue-6));
  --login_bg: rgba(255, 255, 255, 0.8);
  --charts_color1: #53b8ec;
  --charts_color2: #f15427;
  --nav_text_color: white;
  --container_width: 1200px;
  --md-bk-color: white;
  --hightColor: #d71345;
  --scrollbarBg: rgba(0, 0, 0, 0.1);
  --maskBg: rgba(0, 0, 0, 0.01);
  //   vue3中body有默认属性margin:8px如何去掉?
  margin: 0;
}

.ab_banner {
  height: 600px;
  width: 100%;
  background-color: #2b3539;
  overflow: hidden;

  img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
}
</style>
